<!-- 权限列表 -->
<template>
  <div>
        <!-- 面包屑 -->
     <el-breadcrumb separator="/" class="header">
        <el-breadcrumb-item >首页</el-breadcrumb-item>
        <el-breadcrumb-item>权限管理</el-breadcrumb-item>
        <el-breadcrumb-item>角色列表</el-breadcrumb-item>
     </el-breadcrumb>

      <el-table
      :data="power"
      style="width: 100%">
      <el-table-column
        prop="id"
        label="#"
        width="90">
      </el-table-column>
      <el-table-column
        prop="authName"
        label="权限名称"
        width="250">
      </el-table-column>
      <el-table-column
        prop="path"
        label="路径">
      </el-table-column>level
       <el-table-column
        label="权限等级">
        <template v-slot="power">
           <el-button type="primary" v-if="power.row.level==0" disabled>一级</el-button>
           <el-button type="success" v-else-if="power.row.level==1" disabled>二级</el-button>
           <el-button type="info" v-else disabled>三级</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>

import {getrights} from "network/power.js"

export default {
  name:"power",
  data () {
      return {
          power:[],
          count:0
      }
  },
  created () {
      getrights().then(res=>{
          console.log(res)
          this.power.push(...res.data.data)
      })
  }
}

</script>
<style scoped>
    .header{
            margin-bottom: 20px;
        }
</style>